<template>
  <view class="container">
    <view class="navbar u-f-ajc">
      <image src="/static/jibei/guquan/header.png" mode="widthFix"></image>
    </view>

    <view class="content">
      <view class="u-f-ac u-f-jsb bi_box">
        <image src="/static/jibei/guquan/bi.png" mode=""></image>
        <view class="bi_right_box u-f u-f-jse u-f-column">
          <view class="u-f-ac u-f-jsb num_box" @click="obtain">
            <view class="u-f-ajc u-f-column ">
              <view class="kuang_title">待释放股值</view>
              <view class="kuang_num">{{tzz}}</view>
            </view>
            <u-icon name="arrow-right" size="32" color="#115763"></u-icon>
          </view>
          <view class="u-f-ac u-f-jsb num_box" @click="totzzdh">
            <view class="u-f-ajc u-f-column ">
              <view class="kuang_title">已释放股值</view>
              <view class="kuang_num">{{tzz_release}}</view>
            </view>
            <u-icon name="arrow-right" size="32" color="#115763"></u-icon>
          </view>
        </view>
      </view>
      <view class="duihuan_title u-f-ac u-f-jsb">
        <view>股值</view>
        <view style="color: #CA2C09;" @click="toarticle">更多全球购好项目 ></view>
      </view>
      <view class="msg_box">
        <view class="msg_item" style="height: 40%;">
          <view class="msg_title">股券来源</view>
          <view class="msg_text">#股券</view>
        </view>
        <view class="msg_item" style="height: 60%;">
          <view class="msg_title">股券价值</view>
          <view class="msg_text">#股券</view>
        </view>
      </view>

      <view class="item_list">
        <view class="items u-f-ac">
          <view class="u-f-ajc" style="width: 50%;">时间</view>
          <view class="u-f-ajc" style="width: 25%;">数量</view>
          <view class="u-f-ajc" style="width: 25%;">状态</view>
        </view>
        <view class="items items2 u-f-ac" @click="toarticlexq(value.projectid)" v-for="(value,key) in list" :key="key">
          <view class="u-f-ajc" style="width: 50%;">{{value.time}}</view>
          <view class="u-f-ajc" style="width: 25%;">{{value.tzz}}</view>
          <!-- <view class="u-f-ajc" style="width: 25%;" v-if="value.status==0">待签约</view>
          <view class="u-f-ajc" style="width: 25%;" v-if="value.status==5">已签约</view> -->
          <view class="u-f-ajc" style="width: 25%;">集贝消费</view>
        </view>
      </view>
    </view>

    <view
      style="display: flex;background-color: #fff;width: 100%;padding-top: 5px;position: fixed;bottom: 5upx;height: 120upx;background-color: #115763;color: #fff;justify-content: space-around;">
      <view class="u-f-ajc u-f-column" @click="getbuy">
        <image style="width: 66upx;height: 66upx;" src="../../../static/goumai.png" mode=""></image>
        <view style="font-size: 20rpx;">
          购买
        </view>
      </view>
      <view class="u-f-ajc u-f-column" @click="getsale">
        <image style="width: 66upx;height: 66upx;" src="../../../static/guamai.png" mode=""></image>
        <view style="font-size: 20rpx;">
          挂卖
        </view>
      </view>
    </view>

  </view>
</template>

<script>
  import uniLoadMore from '../../../components/uni-load-more.vue';
  export default {
    components: {
      uniLoadMore
    },
    data() {
      return {
        qy_info: '',
        tzz_release: '',
        tzz: '',
        project: '',
        s_exchange: '',
        list: [],
        wheel: '',
        zichan_power: '',
        nzichan_power: '',
        bz: '',
        bz_release: '',
        res: [],
        openid: '',
        systemInfo: [],
        active: "active",
        index: 1,
        topres: 1,
        newsList: [],
        loadingText: '加载中...',
        loadingType: 0,
        contentText: {
          contentdown: '上拉显示更多',
          contentrefresh: '正在加载...',
          contentnomore: '没有更多数据了'
        },
        load: 0,
        page: 1,
        timer: {},
      }
    },
    onLoad: function(e) {
      // uni.showLoading()
      uni.getStorage({
        key: 'openid',
        success: (res) => {
          this.openid = res.data
          this.getarticle()
          this.getassets()
          this.getassets1()
          this.getnewsList()
          //页面一加载时请求一次数据`
          // uni.hideLoading()
        },
        fail: () => {
          uni.navigateTo({
            url: '../login/login'
          });
        }
      });
    },
    // 下拉刷新
    onPullDownRefresh() {
      this.getnewsList()
    },
    // 上拉加载
    onReachBottom() {
      if (this.timer != null) {
        clearTimeout(this.timer)
      }
      this.timer = setTimeout(() => {
        this.getmorenews()
      }, 1000);
    },
    methods: {
      //获取项目列表
      getarticle() {
        uni.request({
          url: this.$BASE_URL+'/index.php?i=2&c=entry&m=ewei_shopv2&do=mobile&r=tzz&app=1',
          method: 'POST',
          data: {
            'openid': this.openid
          },
          header: {
            'Content-Type': 'application/x-www-form-urlencoded'
          },
          success: (res) => {
            console.log(res)
            this.project = res.data.project
          },
          fail: () => {},
          complete: () => {}
        });
      },
      toarticlexq(id) {
        // console.log(id)
        uni.navigateTo({
          url: 'articlexq?id=' + id
        })
      },
      totzzdh() {
        uni.navigateTo({
          url: 'tzzdh'
        })
      },
      obtain() {
        uni.navigateTo({
          url: 'obtain/obtain?type=' + 3
        })
      },
      //获取资产值信息
      getassets() {
        uni.request({
          url: this.$BASE_URL+'/index.php?i=2&c=entry&m=ewei_shopv2&do=mobile&r=tzz.tzz_index&app=1',
          method: 'POST',
          data: {
            'openid': this.openid
          },
          header: {
            'Content-Type': 'application/x-www-form-urlencoded'
          },
          success: (res) => {
            console.log(res)
            this.tzz_release = res.data.tzz_release
            this.tzz = res.data.tzz
            this.qy_info = res.data.qy_info
          },
          fail: () => {},
          complete: () => {}
        });
      },
      getassets1() {
        uni.request({
          url: this.$BASE_URL+'/index.php?i=2&c=entry&m=ewei_shopv2&do=mobile&r=tzz.exchange_list&app=1',
          method: 'POST',
          data: {
            'openid': this.openid
          },
          header: {
            'Content-Type': 'application/x-www-form-urlencoded'
          },
          success: (res) => {
            console.log(res)
            this.list = res.data.exchangelog
          },
          fail: () => {},
          complete: () => {}
        });
      },
      getbuy() {
        uni.navigateTo({
          url: 'buy1'
        })
      },
      getsale() {
        uni.navigateTo({
          url: 'sale1'
        })
      },
      toarticle() {
        uni.navigateTo({
          url: 'article'
        })
      },
      getmorenews() {
        this.page++; //每触底一次 page +1
        if (this.loadingType !== 0) { //loadingType!=0;直接返回
          return false;
        }
        this.loadingType = 1;
        uni.showNavigationBarLoading(); //显示加载动画
        uni.request({
          url: this.$BASE_URL+'/index.php?i=2&c=entry&m=ewei_shopv2&do=mobile&r=member.tzz&app=' +
            this.page,
          method: 'POST',
          data: {
            'openid': this.openid
          },
          header: {
            'Content-Type': 'application/x-www-form-urlencoded'
          },
          success: function(res) {
            if (res.data.tzz == '') { //没有数据
              this.loadingType = 2;
              uni.hideNavigationBarLoading(); //关闭加载动画
              return;
            }
            // this.newsList = this.newsList.concat(res.data.tzz);//将数据拼接在一起
            this.loadingType = 0; //将loadingType归0重置
            uni.hideNavigationBarLoading(); //关闭加载动画
          }
        });
      },
      // 第一次请求数据，刷新

      getnewsList() {
        // this.setTopAjax()
        this.loadingType = 0;
        uni.showNavigationBarLoading();
        uni.request({
          url: this.$BASE_URL+'/index.php?i=2&c=entry&m=ewei_shopv2&do=mobile&r=member.tzz&app=1',
          method: 'POST',
          data: {
            'openid': this.openid
          },
          header: {
            'Content-Type': 'application/x-www-form-urlencoded'
          },
          success: res => {
            // console.log(res)
            this.page++; //得到数据之后page+1
            this.topres = res.data.leiji_tzz;
            this.newsList = res.data.tzz;
            uni.hideNavigationBarLoading();
            uni.stopPullDownRefresh(); //得到数据后停止下拉刷新
            // console.log(this.newsList)
          }
        });
      },
    },
  }
</script>

<style lang="scss">
  page {
    background-color: #B5C3C7;
  }

  .container {
    width: 100%;
    height: 100vh;
    background: url(/static/jibei/home/home_bg.png) no-repeat 0 0;
    background-size: cover;
    box-sizing: border-box;
  }

  .navbar {
    width: 100%;
    padding: 140rpx 0 0;

    image {
      width: 80%;
    }
  }

  .content {
    // padding: 0 40rpx;
    padding-bottom: 200rpx;
  }

  .bi_box {
    padding: 0 30rpx;

    image {
      width: 200rpx;
      height: 200rpx;
    }

    .bi_right_box {
      width: 460rpx;
      height: 260rpx;
      background: url(/static/jibei/guquan/kuang2.png) no-repeat 0 0;
      background-size: cover;
      padding: 24rpx 60rpx;
      box-sizing: border-box;

      .num_box {
        view {
          line-height: 1;
          font-size: 30rpx;
          color: #115763;
        }

        .kuang_num {
          font-size: 36rpx;
          color: #CA2C09;
          margin-top: 10rpx;
        }
      }
    }
  }

  .duihuan_title {
    padding: 0 70rpx;

    view {
      font-size: 30rpx;
      color: #115763;
    }
  }

  .msg_box {
    width: 100%;
    height: 520rpx;
    background: url(/static/jibei/guquan/kuang.png) no-repeat 0 0;
    background-size: cover;
    box-sizing: border-box;
    padding: 40rpx 60rpx;

    .msg_item {
      width: 100%;
      height: 50%;
      color: #FFFFFF;

      .msg_title {
        font-size: 38rpx;
      }
    }
  }

  .item_list {
    .items {
      border-bottom: 2px solid #0F6C76;
      padding: 16rpx 0;

      view {
        color: #115763;
        font-size: 30rpx;
      }
    }

    .items2 {
      view {
        color: #CA2C09;
      }
    }
  }
</style>
